<%-- 
    Document   : product_detail
    Created on : 05-ene-2012, 1:46:36
    Author     : Usuario
--%>
<%@page import="com.sdd.plains.CommentPlain"%>
<%@page import="com.sdd.entities.Comment"%>
<%@page import="com.sdd.plains.FeatureCategoryPlain"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.List"%>
<%@page import="com.sdd.plains.FeaturePlain"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.sdd.plains.ProductPlain"%>
<%
    ProductPlain p = (ProductPlain) request.getSession().getAttribute("product_plain");
%>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div style="height: 60%">
    <div style="width: 300; background: #cccccc">
        <img src="img/stewie.jpg" style="height: 300; width: 300; border: 0px;"/>
    </div>
    <div style="width: 66,6%; position: absolute; top: 5%; left: 310px">
        <fieldset>
            <legend><%=p.getName()%></legend>
            <p><b>Description:</b>   <%=p.getDescription()%></p>
            <p><b>Price:</b>   <%=p.getPrice()%> &euro;</p>
            <input type="submit" value="Add to Cart" id="addbutton" onclick="addToCart(<%=p.getProductId()%>)"/>
        </fieldset>
        <br />
        <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://localhost:8080/SDDStore-war/?id=<%=p.getProductId()%>" data-text="Check this item">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
        <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
        <!--<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>-->
        
        <br />
        <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Flocalhost:8080%2F%3Fid%3D&amp<%=p.getProductId()%>;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
        <!--<div class="fb-like" data-href="http://localhost:8080/SDDStore-war/?id=<%=p.getProductId()%>" data-send="true" data-width="450" data-show-faces="true"></div>-->
        
    </div>
</div>

<div id="tabs" style="position: absolute; top: 320px">
    <ul>
        <li><a href="#tabs-1">Features</a></li>
        <li><a href="#tabs-2">Comments</a></li>
    </ul>
    <div id="tabs-1" >
        <table border="0">
        <%
            request.getSession().removeAttribute("paint_product");
            List<FeaturePlain> f = p.getFeatures();
            Iterator<FeaturePlain> it=f.iterator();
            if (f!=null){
                while(it.hasNext()){
                    FeaturePlain fp = it.next();
                    FeatureCategoryPlain fcp = fp.getCategory();
        %>
            <tr><th ><%= fcp.getName()%></th></tr>
            <tr>
                <td><b><%= fp.getSummary()%></b></td>
                <td><%= fp.getDescription()%></td>
            </tr>
        <% }} %>
        </table>
    </div>
    <div id="tabs-2">
        <textarea id="comment" rows="3" cols="172">Insert comment here</textarea>
        <input type="submit" value="Commit" onclick="saveComment(<%=p.getProductId()%>)" />
        <%
            List<CommentPlain> comments = (List<CommentPlain>) request.getSession().getAttribute("comments");
            Iterator<CommentPlain> it2 = comments.iterator();
            CommentPlain comment;
            while(it2.hasNext()) {
                comment = it2.next();
        %>
            <fieldset>
                <legend><b><%=comment.getCommentator().getLogin()%></b> on <%=comment.getDateAdded()%></legend>
                <p><%=comment.getText()%></p>
            </fieldset>
        <%
            }
        %>
    </div>
</div>
    
<script type="text/javascript">
    $(function(){
        $('#tabs').tabs();
        $('#dialog_link, ul#icons li').hover(
        function() { $(this).addClass('ui-state-hover'); }, 
        function() { $(this).removeClass('ui-state-hover'); }
    );
    });
</script>
